﻿@inherits PageLayout

<KLayout Layout="this" Class="@Context.UserSetting.Size">
    @if (IsLoaded)
    {
        if (Context.IsMobileApp)
        {
            <AppLayout>@Body</AppLayout>
        }
        else
        {
            <Layout Style="min-height:100vh;">
                <Sider @bind-Collapsed="collapsed" Class="@SiderClass" Theme="SiderTheme.Light" CollapsedWidth="60" NoTrigger Collapsible>
                    <div class="kui-logo"></div>
                    <div class="kui-scroll">
                        <AntMenu Items="UserMenus" />
                    </div>
                </Sider>
                <Layout>
                    <Header Class="kui-header">
                        <div class="kui-header-left">
                            @if (collapsed)
                            {
                                <Icon Type="menu-unfold" Theme="outline" Class="trigger" OnClick="OnToggle" />
                            }
                            else
                            {
                                <Icon Type="menu-fold" Theme="outline" Class="trigger" OnClick="OnToggle" />
                            }
                            <TopBreadcrumb Current="Context.Current" />
                        </div>
                        <TopNavRight OnMenuClick="OnMenuClick" />
                    </Header>
                    <Content Class="kui-page">
                        @if (Context.UserSetting.MultiTab && !Context.IsMobile)
                        {
                            <ReuseTabs Class="top-row px-4" TabPaneClass="content px-4" />
                        }
                        else
                        {
                            <div class="kui-page-body">@Body</div>
                        }
                    </Content>
                    @if (AntConfig.Option.ShowFooter)
                    {
                        if (AntConfig.Option.Footer != null)
                        {
                            <Footer Style="text-align:center">@AntConfig.Option.Footer</Footer>
                        }
                        else
                        {
                            <Footer Style="text-align:center"><PageFooter /></Footer>
                        }
                    }
                </Layout>
            </Layout>
        }
        @if (IsLogin && !Context.IsMobileApp)
        {
            <Drawer Closable="true" @bind-Visible="showSetting" Placement="right" Title='(Language["Nav.Setting"])' Width="320">
                <SettingForm OnChanged="OnSettingChanged" />
            </Drawer>
        }
        @if (showSpin)
        {
            <Spin Tip="@spinTip" />
        }
    }
</KLayout>

@code {
    private string spinTip = "";
    private bool showSpin = false;
    private bool showSetting = false;
    private bool collapsed = false;
    private string SiderClass => Context.UserSetting.MenuTheme == "Dark" ? "kui-menu-dark" : "";

    protected override async Task OnInitAsync()
    {
        await base.OnInitAsync();
        collapsed = Context.UserSetting.Collapsed;
        if (Context.IsMobile)
            collapsed = true;
    }

    public override async Task ShowSpinAsync(string text, Func<Task> action)
    {
        if (action == null)
            return;

        showSpin = true;
        spinTip = text;
        await StateChangedAsync();
        await Task.Run(async () =>
        {
            try
            {
                await action?.Invoke();
            }
            catch (Exception ex)
            {
                await OnError(ex);
            }
            showSpin = false;
            await StateChangedAsync();
        });
    }

    private void OnToggle() => collapsed = !collapsed;

    private void OnSettingChanged(SettingInfo info)
    {
        collapsed = info.Collapsed;
    }

    //Admin
    private void OnMenuClick(string id)
    {
        switch (id)
        {
            case "logout":
                UI?.Confirm(Language["Tip.Exits"], SignOutAsync);
                break;
            case "setting":
                showSetting = true;
                StateHasChanged();
                break;
        }
    }
}